<template>
	<view class="container">
		<view class="notice">
			<view class="u-flex u-flex-items-center u-flex-center header">
				<view class="notice_line"></view>
				<view class="notice_title">
					<text class="text">注意事项</text>
				</view>
				<view class="notice_line"></view>
			</view>
			<view class="item">
				<view class="item_title">
					<text>1.找不到开户行怎么办？</text>
				</view>
				<view class="item_content">
					开户支行请确保选择到“易宝支付-备付金账户”，选择收款银行时搜索“支付”，先选择“<text class="vital">支付机构备付金集中存管账户</text>”或“<text class="vital">支付机构</text>”，开户地选择“<text class="vital">北京</text>”，再通过网点找到“<text class="vital">易宝支付-备付金账户</text>”。若未查询到，建议您更换其他银行进行付款。
				</view>
			</view>
			<view class="item">
				<view class="item_title">
					<text>2.转账后需要做什么？</text>
				</view>
				<view class="item_content">
					转账后不需要您再进行其他操作，请勿重复转账。若未及时到账，请耐心等待。
				</view>
			</view>
			<view class="item">
				<view class="item_title">
					<text>3.银行转账时效说明</text>
					<text style="color: #888888;">(非7*24小时汇款银行参看此时效)</text>
				</view>
				<view class="item_content">
					<view class="table">
						<view class="th">
							<view class="td" style="width: 40%;">日期</view>
							<view class="td" style="width: 30%;">时段</view>
							<view class="td" style="width: 30%;">到账时效</view>
						</view>
						<view class="tr">
							<view class="td" style="width: 40%;">工作日</view>
							<view class="td" style="width: 30%;">00:00-17:15</view>
							<view class="td" style="width: 30%;">实时到账</view>
						</view>
						<view class="tr">
							<view class="td" style="width: 40%;">工作日</view>
							<view class="td" style="width: 30%;">17:15-20:30</view>
							<view class="td" style="width: 30%;">非实时到账</view>
						</view>
						<view class="tr">
							<view class="td" style="width: 40%;">工作日非最后一天</view>
							<view class="td" style="width: 30%;">20:30-24:00</view>
							<view class="td" style="width: 30%;">实时到账</view>
						</view>
						<view class="tr">
							<view class="td" style="width: 40%;">工作日最后一天</view>
							<view class="td" style="width: 30%;">20:30-24:00</view>
							<view class="td" style="width: 30%;">非实时到账</view>
						</view>
						<view class="tr">
							<view class="td" style="width: 40%;">节假日</view>
							<view class="td" style="width: 30%;">00:00-20:30</view>
							<view class="td" style="width: 30%;">非实时到账</view>
						</view>
						<view class="tr">
							<view class="td" style="width: 40%;">节假日非最后一天</view>
							<view class="td" style="width: 30%;">00:00-20:30</view>
							<view class="td" style="width: 30%;">非实时到账</view>
						</view>
						<view class="tr">
							<view class="td" style="width: 40%;">节假日最后一天</view>
							<view class="td" style="width: 30%;">20:30-24:00</view>
							<view class="td" style="width: 30%;">实时到账</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="back_btn">
			<u-button text="返回" :hairline="false" color="#5C8CFF" iconColor="#FFFFFF" :customStyle="{width:'384rpx',height:'88rpx',borderRadius:'8rpx'}" @click="$u.route({type:'back'})"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #4179FF;

		.container {
			padding-bottom: 20rpx;

			.notice {
				width: 710rpx;
				background: #FFFFFF;
				border-radius: 12rpx;
				padding-bottom: 2rpx;
				margin: 14rpx auto 0;

				.header {
					padding: 38rpx 0 30rpx;

					.notice_title {
						display: flex;
						align-items: center;

						.text {
							display: flex;
							align-items: center;
							font-weight: 500;
							font-size: 30rpx;
							color: #4179FF;
						}

						.text::before {
							margin-right: 20rpx;
						}

						.text::after {
							margin-left: 20rpx;
						}

						.text::before,
						.text::after {
							content: '';
							display: block;
							width: 8rpx;
							height: 8rpx;
							background: #4179FF;
							border-radius: 4rpx;
						}
					}

					.notice_line {
						width: 144rpx;
						height: 2rpx;
						background: #4179FF;
						border-radius: 1rpx;
					}
				}

				.item {
					margin: 0 20rpx 40rpx;

					.item_title {
						font-weight: 500;
						font-size: 30rpx;
						color: #333333;
						margin-bottom: 20rpx;
					}

					.item_content {
						font-weight: 400;
						font-size: 26rpx;
						color: #888888;
						line-height: 40rpx;

						.vital {
							color: #333333;
						}

						.table {
							border: 1rpx solid #DDDDDD;
							margin-top: 20rpx;

							.th {
								display: flex;
								height: 80rpx;
								background: #EEEEEE;

								.td {
									display: flex;
									align-items: center;
									font-weight: 400;
									font-size: 28rpx;
									color: #333333;
									padding-left: 6rpx;
									border: 1rpx solid #DDDDDD;
								}
							}

							.tr {
								display: flex;
								min-height: 80rpx;
								background: #FFFFFF;

								.td {
									display: flex;
									align-items: center;
									font-weight: 400;
									font-size: 28rpx;
									color: #666666;
									padding-left: 6rpx;
									border: 1rpx solid #DDDDDD;
								}
							}
						}
					}
				}
			}

			.back_btn {
				margin-top: 40rpx;
			}
		}
	}
</style>